<!DOCTYPE html>
<html>
<head>
	<title>微百佳</title>
</head>
<include file="Public:yygame_top" />

<style>
 #mcover {position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1; }
 #mcover img { width:100%;}
 
 .yq{ margin:0 auto; margin-top:50px; position:absolute; left:20%; width:100%;}
 .yq img{ width:60%; }
 .yq_bottom{  width:100%; position:absolute; bottom:0px; color:#F18C19; text-align:center; margin-bottom:10px;}
 .yq_bottom img{ width:8%;margin-bottom:10px;}
</style>

<body  style=" background:#210907;margin:0 auto; font-size:15px;">

<div id="mcover"><img src="__PUBLIC__/Image/yygame/game_back01.png" /></div>

<div class="yq" id="qiancover" ><img src="__PUBLIC__/Image/yygame/img_cq01.png" /></div>

<div id="yy_video" style="display:none;" > 
<audio id="bgaudio" src="__PUBLIC__/Video/hb.mp3"></audio>
 </div>
<div class="yq_bottom">
<img src="__PUBLIC__/Image/yygame/img_yy.png" />
<p id="yz_font">摇一摇开始求签</p>
</div>
    

</body>
<script>

//摇一摇(使用DeviceMotion事件, 推荐,应为可以计算加速度)
if(window.DeviceMotionEvent) {
    var speed = 25;    // 用来判定的加速度阈值，太大了则很难触发
    var x, y, z, lastX, lastY, lastZ;
    x = y = z = lastX = lastY = lastZ = 0;

    window.addEventListener('devicemotion', function(event){
        var acceleration = event.accelerationIncludingGravity;
        x = acceleration.x;
        y = acceleration.y;
        if(Math.abs(x-lastX) > speed || Math.abs(y-lastY) > speed) {
            // 用户设备摇动了，触发响应操作
            // 此处的判断依据是用户设备的加速度大于我们设置的阈值
			start();
        }
        lastX = x;
        lastY = y;
    }, false);
}
var isStarted = false;    // 是否开始摇动


// 开始摇签
function start() {
    isStarted = true;
    moveover_yy('#qiancover');
	$('#yy_video').css("display",'');
	document.getElementById('bgaudio').play();
	
	$('#yz_font').html("摇签中"); 
     setTimeout(jumpToDecode, 3000);
}


function moveover_yy(o){
    var $panel = $(o);
    box_left = ($(window).width() -  $panel.width()) / 2+$(window).width()*0.2;
    $panel.css({'left': box_left,'position':'absolute'});
    for(var i=1; 4>=i; i++){
        $panel.animate({left:box_left-(40-8*i)},50);
        $panel.animate({left:box_left+2*(40-8*i)},50);
    }
}
// 跳至签文页面
function jumpToDecode(){
	/*if(isStarted)*/
    window.location = "{:U('Yygame/shake_result')}";
};

</script>
</html>

